<template>
  <div class="welfare-pro-list">
    <div class="mescroll"  ref="mescroll">
      <news-list :newsLists="newsList"></news-list>
    </div>
  </div>
</template>

<script>
import { getWelfareNews, welfareProList } from "@/api/api"
import newsList from '@/components/newsList'
import MeScroll from 'mescroll.js'
import 'mescroll.js/mescroll.min.css'
  export default {
    components: {
      newsList
    },
    data () {
      return {
        newsList: [],
      }
    },
    created () {
      console.log()
      this.pro_id = this.$route.query.pro_id
    },
    //实例化上拉加载
    mounted () {
      this.mescroll = new MeScroll(this.$refs.mescroll, { 
        up: {
          callback: this.upCallback
        }
      })
    },
    methods: {
      router (path) {
        this.$router.push(path)
      },
      upCallback (page) {
        if(this.pro_id){
          welfareProList(this.pro_id, page.num, page.size).then((res) => {
            if (page.num == 1){
              this.newsList = []
            }
            this.$nextTick(() => {
              this.mescroll.endSuccess(res.data.data.info);
            })
            for(var i in res.data.data.info){
              res.data.data.info[i].type = "pro"
            }
            this.newsList = this.newsList.concat(res.data.data.info)
          }).catch((err) => {
            console.dir(err)
            this.mescroll.endErr()
          })          
        }else{          
          getWelfareNews(page.num, page.size).then((res) => {
            if (page.num == 1){
              this.newsList = []
            }
            this.$nextTick(() => {
              this.mescroll.endSuccess(res.data.data.list);
            })
            for(var i in res.data.data.list){
              res.data.data.list[i].type = "welfare"
            }
            this.newsList = this.newsList.concat(res.data.data.list)
          }).catch((err) => {
            console.dir(err)
            this.mescroll.endErr()
          })
        }
      },
    }
  }
</script>

<style lang="stylus" scoped>
.welfare-pro-list
  padding-top 1.5rem
  .mescroll
    position fixed
    top 0
    bottom 0
    height auto
    padding 1.5rem 0
</style>
